<div class="gz-body">

    <div class="index-h">
        <h3 routerLink="/indexMy"><img style="margin-right: 1rem;width:1rem;" src="../../../assets/icons/back2.png" alt="">
        </h3>
        <div class="login-tab ">
            <span class="no-activitie" [ngClass]="{ activitie: type == 0 }" (click)="changeTab(0)">
                {{'order-Page.LXS' | translate}}
            </span>
            <span class="no-activitie" [ngClass]="{ activitie: type == 1 }" (click)="changeTab(1)"> {{'order-Page.DY' | translate}}</span>
        </div>
    </div>

    <div class="gz-list-body">
        <div *ngIf="type == 0" class="uc-order-list">
            <ul class="order-list">
                <li *ngFor="let item of orderList" >
                    <div class="order-list-info">
                        <img src="{{item?.image}}" />
                        <h3>
                            <span>{{item?.name}}</span>
                            <p *ngIf='item?.isOpen == "Y"' class="list-info-type">{{'AGENCY-Page.serviceStatus-Y' | translate}}</p>
                            <p *ngIf='item?.isOpen == "N"' class="list-info-type">{{'AGENCY-Page.serviceStatus-N' | translate}}</p>
                        </h3>
                        <div class="f-h">¥ {{item?.reservationFee}}</div>
                        <div class="list-fw" >
                            <a *ngFor="let iserver of item.agencyServiceItemList">{{iserver.name}}</a>
                        </div>
                        <div class="order-list-btn">
                            <a class="pay-btn" (click)="goPay(item,'A')">{{'gz-page.html1' | translate}}</a>
                            <a class="cancel-btn" (click)="goDel(item,'A')">{{'gz-page.html2' | translate}}</a>
                        </div>
                    </div>
                </li>
                <li class="nodata" *ngIf="orderList&&orderList.length < 1&&!loading1">
                    <img src="../../assets/images/usercenter/nodata1.png" />
                    <p>{{'gz-page.html3' | translate}}</p>
                </li>
            </ul>
        </div>
        <div *ngIf="type == 1" class="uc-log-list">
            <ul class="order-list">
                <li *ngFor="let item of gList" >
                    <div class="order-list-info">
                        <img style="border-radius: 50%;" src="{{item?.image}}" />
                        <h3>
                            <span>{{item?.name}}</span>
                            <p *ngIf='item?.isOpen == "Y"' class="list-info-type">{{'AGENCY-Page.serviceStatus-Y' | translate}}</p>
                            <p *ngIf='item?.isOpen == "N"' class="list-info-type">{{'AGENCY-Page.serviceStatus-N' | translate}}</p>
                        </h3>
                        <div class="f-h">¥ {{item?.reservationFee}}</div>
                        <div class="list-fw" >
                            <a *ngFor="let iserver of item.guideServiceItemList">{{iserver.name}}</a>
                        </div>
                        <div class="order-list-btn">
                            <a class="pay-btn" (click)="goPay(item,'G')">{{'gz-page.html1' | translate}}</a>
                            <a class="cancel-btn" (click)="goDel(item,'G')">{{'gz-page.html2' | translate}}</a>
                        </div>
                    </div>
                </li>
                <li class="nodata" *ngIf="gList&&gList.length < 1&&!loading1">
                    <img src="../../assets/images/usercenter/nodata1.png" />
                    <p>{{'gz-page.html4' | translate}}</p>
                </li>
            </ul>
        </div>
    </div>
</div>